﻿<%@ Page Title="" Language="C#" MasterPageFile="~/EasyUI.Master" AutoEventWireup="true" CodeBehind="CBD.aspx.cs" Inherits="jnagr.Web.weatherinfo.CBD" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link href="../CSS/IconExtension.css" rel="stylesheet" />
    <script src="../Script/export.js"></script>
    <script src="../Script/username.js"></script>
    <script src="../Script/datetime.js"></script>
    <script src="../Script/json2.js"></script>
    <script src="../Script/highcharts.js"></script>  
    <script src="../Script/exporting.js"></script>
    <script type="text/javascript">
        var colums;
        var iscollect = "";
        var mleveltype = [{ "id": "4", "text": "国家级", "iconCls": "icon-gj", "checked": true }, { "id": "3", "text": "省级", "iconCls": "icon-sj", "checked": true }, { "id": "2", "text": "市级", "iconCls": "icon-ssj", "checked": true }, { "id": "1", "text": "县级", "iconCls": "icon-xj", "checked": true }];

        $(function () {
            $("#mlevel").combotree({ data: mleveltype, width: 120, valueField: 'id', textField: 'text', editable: false, panelHeight: 'auto', multiple: true, checkbox: true });

            year = new Date().getFullYear();
            $('#jd').combobox({
                onSelect: function (newValue, oldValue) {
                    if (newValue.text == '一季度') {
                        $("#StartTime").datebox("setValue", year + "-1-1");
                        $("#EndTime").datebox("setValue", year + "-3-31");
                    }
                    else if (newValue.text == '二季度') {
                        $("#StartTime").datebox("setValue", year + "-4-1");
                        $("#EndTime").datebox("setValue", year + "-6-30");
                    }
                    else if (newValue.text == '三季度') {
                        $("#StartTime").datebox("setValue", year + "-7-1");
                        $("#EndTime").datebox("setValue", year + "-9-30");
                    }
                    else if (newValue.text == '四季度') {
                        $("#StartTime").datebox("setValue", year + "-10-1");
                        $("#EndTime").datebox("setValue", year + "-12-31");
                    }
                    else if (newValue.text == '当天') {
                        var curr_time = new Date();
                        var tc_time = new Date(curr_time.getTime() + 24 * 60 * 60 * 1000);
                        var strDate = curr_time.getFullYear() + "-";
                        strDate += curr_time.getMonth() + 1 + "-";
                        strDate += curr_time.getDate();
                        var strDateend = tc_time.getFullYear() + "-";
                        strDateend += tc_time.getMonth() + 1 + "-";
                        strDateend += tc_time.getDate();
                        $("#StartTime").datebox("setValue", strDate);
                        $("#EndTime").datebox("setValue", strDateend);
                    }
                }
            });
            InitGird();
            InitTree();
            Highcharts.setOptions({
                lang: {
                    contextButtonTitle: "图表导出菜单",
                    decimalPoint: ".",
                    downloadJPEG: "下载JPEG图片",
                    downloadPDF: "下载PDF文件",
                    downloadPNG: "下载PNG文件",
                    downloadSVG: "下载SVG文件",
                    drillUpText: "返回 {series.name}",
                    loading: "加载中",
                    months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
                    noData: "没有数据",
                    numericSymbols: ["千", "兆", "G", "T", "P", "E"],
                    printChart: "打印图表",
                    resetZoom: "恢复缩放",
                    resetZoomTitle: "恢复图表",
                    shortMonths: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
                    thousandsSep: ",",
                    weekdays: ["星期一", "星期二", "星期三", "星期三", "星期四", "星期五", "星期六", "星期天"]
                }
            });

        });
        var wchartInstance;
        var WChartJS = {
            init: function (chs) {
                var s = "[";
                $.each(chs, function () {
                    s = s + "{name:'" + this + "',data:[]},";
                });
                s = s.substr(0, s.length - 1);
                s = s + "]";
                wchartInstance = new Highcharts.Chart({
                    chart: {
                        renderTo: 'chartArea',
                        type: 'line'
                    },
                    credits: {
                        enabled: false
                    },
                    exporting: {
                        enabled: true
                    },
                    title: {
                        text: '',
                        x: -20 //center
                    },
                    xAxis: {
                        type: 'datetime',
                        labels: {
                            step: 1,
                            formatter: function () {
                                return new Date(this.value).toLocaleDateString();
                            }
                        }
                    },                    
                    yAxis: {
                        title: {
                            text: '数值'
                        },
                        plotLines: [{
                            value: 0,
                            width: 1,
                            color: '#808080'
                        }]
                    },
                    tooltip: {
                        formatter: function () {                            
                                return '<b>' + this.series.name + '：</b>' + this.y + '<br/> <b>时间：</b>' + new Date(this.x).toLocaleString();
                        }

                    },
                    legend: {
                        //layout: 'vertical',
                        align: 'center',
                        verticalAlign: 'top',
                        borderWidth: 0
                    },
                    series: eval(s)
                });
            }
        };
        function InitTree() {           
            $('#pt').tree({
                url: '../harmfulinfo/GetHarm.ashx?type=4', //请求数据的页面               
                width: '100%', //宽度                
                lines: true,
                method: 'post',
                checkbox: true,
                queryParams: { "action": "queryta" },
                onCheck: function (node) {
                    reloadgrid();
                },
                onLoadSuccess: function (node, param) {
                    $('#pt').tree("collapseAll");
                    var node = $('#pt').tree("getRoot");
                    if (node)
                        $('#pt').tree("expand", node.target);
                }
            });
            $('#pt1').tree({
                url: '../harmfulinfo/GetHarm.ashx?type=4', //请求数据的页面               
                width: '100%', //宽度                
                lines: true,
                method: 'post',
                checkbox: true,
                queryParams: { "action": "queryth" },
                onCheck: function (node) {
                    reloadgrid();
                },
                onLoadSuccess: function (node, param) {
                    $('#pt1').tree("collapseAll");
                    var node = $('#pt1').tree("getRoot");
                    if (node)
                        $('#pt1').tree("expand", node.target);
                }
            });
        }
        //初始化表格
        function InitGird() {
            $('#tt').datagrid({
                title: '虫情动态_虫害', //表格标题
                url: '../forestpets/GetPets.ashx', //请求数据的页面
                sortName: 'inputTime', //排序字段
                idField: 'fp_id', //标识字段,主键
                iconCls: '', //标题左边的图标
                width: '100%', //宽度
                nowrap: false, //是否换行，True 就会把数据显示在一行里
                striped: true, //True 奇偶行使用不同背景色
                collapsible: false, //可折叠
                sortOrder: 'desc', //排序类型
                remoteSort: true, //定义是否从服务器给数据排序
                fitColumns: true,
                singleSelect: true,
                method: 'post',
                columns: [[
                    { title: '区域', field: 'address', width: 150, sortable: true },
                    //{ title: '树种', field: 'pname', width: 150 },
                    { title: '虫名', field: 'hname', width: 150 },
                    { title: '雄虫数量', field: 'maleNums', width: 80 },
                    { title: '雌虫数量', field: 'femaleNums', width: 80 },
                    {
                        title: '性比', field: 's', width: 60, formatter: function (value, row, index) {
                            if (row.maleNums != "" && row.femaleNums != "")
                                //return (row.maleNums / row.femaleNums).toFixed(2);
                                return row.maleNums+'/' +row.femaleNums;
                            else
                                return "";
                        }
                    },
                    {
                        title: '成虫总数', field: 'totalUnit', width: 80, formatter: function (value, row, index) {
                            var m = 0, f = 0;
                            if (row.maleNums != "") m = parseInt(row.maleNums);
                            if (row.femaleNums != "") f = parseInt(row.femaleNums);
                            return m + f;
                        }
                    },
                    {
                        title: '监测人', field: 'uname', width: 120, formatter: function (value, row, index) {
                            if (row.uname != null)
                                return '<a href="#" onclick="top.addTab(\'虫害' + row.uname + '\',\'/weatherinfo/listr.aspx?uid=' + row.uid + '&qh=' + row.remark + '\', \'icon icon-magic\');">' + row.uname + '</a>';
                            else
                                return '';
                        }
                    },
                    { title: '监测点', field: 'mname', width: 150 },
                    {
                        title: '监测时间', field: 'inputTime', width: 150, formatter: function (value, row, index) {
                            if (value != '') {
                                if (value.indexOf('-') != -1) value = value.replace(/-/g, "/");
                                return new Date(value).pattern('yyyy年M月d日');
                            }
                        }
                    }
                ]],
                rowStyler: function (index, row) {
                    var value = row.happenpro;
                    if (value == '轻度以下') {
                        return 'color:green; font-weight:bold;';
                    }
                    else if (value == '轻度') {
                        return 'color:blue; font-weight:bold;';
                    }
                    else if (value == '中度') {
                        return 'color:#FF00FF; font-weight:bold;';
                    }
                    else if (value == '重度') {
                        return 'color:red; font-weight:bold;';
                    }
                },
                onLoadSuccess: function (data) {
                    if (iscollect != "") {
                        var chs = "";
                        var pets = "";
                        var hnodes = $('#pt1').tree('getChecked');                        
                        if (hnodes.length!= 0) {
                            chs = gethname(hnodes).split(",");
                        }
                        else {
                            $.each(data.rows, function (k, v) {
                                temp = v["hname"];
                                if (pets.indexOf(temp) == -1) {
                                    pets = pets + temp + ",";
                                }
                            });
                            if (pets.length > 0) pets = pets.substr(0, pets.length - 1);
                            chs = pets.split(",");;
                        }
                        if (chs.length>0)
                        {
                            WChartJS.init(chs);
                            var n = chs.length;
                            var t1 = "";
                            for (var i = 0; i < n; i++) {
                                t1 = "";
                                var fmc = "";
                                $.each(data.rows, function (k, v) {
                                    if (v["hname"] == chs[i]) {
                                        md = v["inputTime"];
                                        md = md.replace(/-/g, "/");
                                        md = Date.parse(md);
                                        fmc = parseInt(v["femaleNums"]) + parseInt(v["maleNums"]);
                                        t1 = "[" + md + "," + fmc+ "]," + t1;
                                    }

                                });
                                t1 = "[" + t1 + "]";
                                wchartInstance.series[i].setData(eval(t1));
                            }
                        }
                        
                        
                    }

                },
                toolbar: "#tab_toolbar",
                queryParams: { "action": "queryhc"},
                pagination: true, //是否开启分页
                pageNumber: 1, //默认索引页
                pageSize: 20, //默认一页数据条数
                pageList: [10, 20, 50, 200, 500,1000],
                rownumbers: true //行号
            });
        }
        function getids(nodes) {
            var ids = "";
            for (var i = 0; i < nodes.length; i++)
                ids = ids + nodes[i].id + ",";
            if (ids != "")
                ids = ids.substr(0, ids.length - 1);
            return ids;

        }
        function gethname(nodes) {
            var ids = "";
            for (var i = 0; i < nodes.length; i++)
                ids = ids + nodes[i].text + ",";
            if (ids != "")
                ids = ids.substr(0, ids.length - 1);
            return ids;

        }
        function getQueryParams(queryParams) {
            var StartTime = $("#StartTime").datebox("getValue");
            var EndTime = $("#EndTime").datebox("getValue");
            var anodes = $('#pt').tree('getChecked');
            var hnodes = $('#pt1').tree('getChecked');
            var jg = $("#jg").combobox('getValue');
            if (anodes.length != 0) {
                var idstr = getids(anodes);
                queryParams.idstr = idstr;
            }
            else {
                queryParams.idstr = "";
            }
            if (hnodes.length != 0) {
                var idh = getids(hnodes);
                queryParams.idh = idh;
            }
            else {
                queryParams.idh = "";
            }
            var pids = getids(hnodes);                      
            var mlevel = $("#mlevel").combotree("getValues").toString();
            queryParams.mlevel = mlevel;
            queryParams.StartTime = StartTime;
            queryParams.EndTime = EndTime;
            queryParams.jg = jg;
            return queryParams;

        }
        //增加查询参数，重新加载表格  
        function reloadgrid(t) {
            var queryParams = $('#tt').datagrid('options').queryParams;
            getQueryParams(queryParams);
            if (t == "1") {
                queryParams.action = "queryhcc";
                iscollect = "yes";
                $('#tt').datagrid({pageSize:1000});
            }
            else {
                queryParams.action = "queryhc";
                iscollect = "";
            }
            $('#tt').datagrid('options').queryParams = queryParams;
            $("#tt").datagrid('reload');

        }       

    </script>
    <style type="text/css">
        .fitem {
            width: 100%;
        }

            .fitem label {
                width: 60px;
                line-height: 22px;
            }

            .fitem input {
                width: 120px;
            }

        .dl1 {
            color: green;
            font-weight: bold;
        }

        .dl2 {
            color: blue;
            font-weight: bold;
        }

        .dl3 {
            color: yellow;
            font-weight: bold;
        }

        .dl4 {
            color: red;
            font-weight: bold;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="easyui-layout" style="width: 100%; height: 100%;" id="mycon">
        <div region="west" split="true"  style="width: 350px; " id="west">
            <div class="easyui-layout" data-options="fit:true">
                <div data-options="region:'west'" style="width: 150px;overflow-y: auto">
                    <ul id="pt"></ul>
                </div>
                <div data-options="region:'center'" style="overflow-y: auto">
                    <ul id="pt1"></ul>
                </div>
            </div>
        </div>
        <div region="center" style="background: #eee; overflow-y: hidden">
            <div class="easyui-layout" data-options="fit:true">
                <div data-options="region:'center'">
                    <table id="tt">
            </table>
                </div>
            <div id="chartArea" data-options="region:'south',split:true" style="height:200px;"></div>
              </div>
        </div>
        <div id="tab_toolbar" style="padding: 4px;">
            <table cellpadding="0" cellspacing="0" style="width: 100%">
                <tr>
                    <td style="padding-left: 2px">
                        <div>
                            时间从:  
           <input id="StartTime" class="easyui-datebox" style="width: 100px" />
                            到:  
           <input id="EndTime" class="easyui-datebox" style="width: 100px" />
                            <select id="jd" class="easyui-combobox" name="jd" style="width: 80px;">
                                <option value="季度">季度</option>
                                <option value="一季度">一季度</option>
                                <option value="二季度">二季度</option>
                                <option value="三季度">三季度</option>
                                <option value="四季度">四季度</option>
                                <option value="当天">当天</option>
                            </select>
                            <select id="jg" class="easyui-combobox" name="jg" style="width: 80px;">
                                <option value="d">按天</option>
                                <option value="h">按候</option>
                                <option value="x">按旬</option>
                                <option value="m">按月</option>                                
                            </select>
                            <input id="mlevel" name="mlevel" />
                            <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="reloadgrid()">查找</a>
                            <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="Export('excel', $('#tt'));">导出</a>
                            <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="reloadgrid('1')">汇总</a>
                            <input name="idstr" id="idstr" type="hidden" />
                            <input name="idh" id="idh" type="hidden" />
                            <input name="city" id="city" type="hidden" />
                            <input name="st" id="st" type="hidden" />
                            <input name="et" id="et" type="hidden" />
                            <input name="otype" id="otype" type="hidden" />
                        </div>
                    </td>
                </tr>
            </table>

        </div>
    </div>
</asp:Content>
